<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 查询 -->
    <!-- 引入样式 -->
    <script type="text/javascript" src="../js/vue.js"></script>
    <script type="text/javascript" src="../js/axios.min.js"></script>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<body>

<div id="head">
    <h2>{{massage}}</h2>
</div>
<div id="tableView">
    <!--列表-->
    <el-row>
        <el-table :data="tableData"  v-loading.body="loading" border @selection-change="selectionChange" style="width: 100%">
            <el-table-column prop="filename" label="文件名" width="160"></el-table-column>
            <el-table-column prop="danwei" label="单位名称" width="150"></el-table-column>
            <el-table-column  :formatter="Tablestate" prop="state" label="审核状态" width="130"></el-table-column>
            <el-table-column prop="download" label="资料下载" width="130">
                <template scope="scope">
                    <el-button :plain="true" type="success" size="small" icon="el-icon-download" @click="download(scope.row)">资料下载</el-button>
                </template>
            </el-table-column>

            <el-table-column prop="caozuo" label="操作">
                <template scope="scope">
                    <el-button :plain="true" type="success" size="small" icon="edit" @click="editClick(scope.row)">查看详情</el-button>
                </template>
            </el-table-column>
        </el-table>
    </el-row>

    <!--列表底部工具条和分页符-->
    <el-row style="margin-top: 20px" type="flex" justify="end">
        <el-col :span="18" >
            <el-pagination
                    style="float: right"
                    @size-change="pageSizeChange"
                    @current-change="currentPageChange"
                    :current-page="currentPage"
                    :page-sizes="[6,12,18,24]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
            </el-pagination>
        </el-col>
    </el-row>

    <!-- 弹出层 -->
    <!--查看界面-->
    <el-dialog title="查看" :visible.sync="editFormVisible" :close-on-click-modal="false">
        <el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm">
            <el-form-item label="申请清单" prop="score">
                <el-input v-model="editForm.qingdan" auto-complete="off" disabled></el-input>
            </el-form-item>
            <el-form-item label="文件名" prop="inspection">
                <el-input v-model="editForm.filename" auto-complete="off" disabled></el-input>
            </el-form-item>
            <el-form-item label="单位名称" prop="assessment">
                <el-input v-model="editForm.danwei" auto-complete="off" disabled></el-input>
            </el-form-item>
            <el-form-item label="申报等级" prop="score">
                <el-input v-model="editForm.level" auto-complete="off" disabled></el-input>
            </el-form-item>


        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button @click.native="editFormVisible = false">取消</el-button>
        </div>
    </el-dialog>




</div>
</body>
<script>
    var head=new Vue({
        el:"#head",
        data:{
            massage:"申报查询",
        }
    })

 var aa=new Vue({
     el:"#tableView",
     data:{
         //列表数据
         tableData: [
             {  filename:"",
                 danwei:"",
                 state:"",
             }
         ],
         //显示加载中样式
         loading:false,
         //当前页
         currentPage:1,
         //分页大小
         pageSize:1,
         //总记录数
         total:800,
         //删除的弹出框
         deleteVisible:false,
         //编辑界面是否显示
         editFormVisible: false,
         editLoading: false,
         goUrl:'',
         editFormRules: {
             name: [
                 { required: true, message: '请输入姓名', trigger: 'blur' }
             ]
         },
         editForm:{

         }
        },created:function () {
         var self=this;
         var start =(this.currentPage-1)*this.pageSize;
         axios.post('/dataCX/CX',{'start':start,'pageSize':this.pageSize}).then(function(response){
             self.tableData=response.data.data;
             self.total=response.data.total;


         });
     },methods:{
         //审核状态显示
         Tablestate:function(row){
             if (row.state==1){
                 return "审核通过";
             }else if(row.state==0) {
                 return "审核未通过";
             }else{
                 return "未审核";
             }
         },
         //资料下载
         download:function (row) {
             window.location.href="/dataCX/downLoad?filePaths="+row.filepath;
         },
         //查看详情
         editClick:function (row) {
             var self=this;
             var id=row.id;
             axios.post('/dataCX/cha?id='+id).then(function(response){
                 self.editFormVisible = true;
                 self.editForm.qingdan = response.data.qingdan;
                     self.editForm.filename = response.data.filename;
                     self.editForm.danwei = response.data.danwei;
                     self.editForm.level = response.data.level;
             });
         }

     }
 })

</script>
</html>